<template>
	<view>
		<view class="flex align-center justify-between">
			<text class="font-md">热门分类</text>
			<view @click="openMore()" 
			class="flex align-center text-secondary animate__animated animate__faster" 
			hover-class="animate__pulse">
				更多<text class="iconfont icon-bangzhujinru"></text>
			</view>
		</view>
		<view class="flex align-center py-3 border-bottom px-2">
			<view 
			class="border rounded bg-light mx-1 px-2 animate__animated animate__faster" 
			style="font-size: 20rpx;"
			hover-class="animate__jello" 
			v-for="(item,index) in hotCate" 
			:key="index"
			@click="openDetail(item)">{{item.name}}</view>
			
		</view>
	</view>
</template>

<script>
	export default{
		props:['hotCate'],
		methods:{
			// 更多
			openMore(){
				uni.navigateTo({
					url:"/pages/topic-nav/topic-nav"
				})
			},
			// 话题详情页
			openDetail(item){
				console.log("打开话题详情页",item.name)
			}
		}
	}
</script>

<style>
</style>
